/*
 * @Description: 功能按钮
 * @Author: Zzt
 * @Date: 2022-11-03 13:39:03
 * @LastEditTime: 2022-11-07 10:02:50
 */

import { Button } from 'antd';
import classNames from 'classnames/bind';
import { useMemo, useState } from 'react';
import { useMappingRelationContext } from '../contexts/MappingRelationContext';
import styles from '../styles/sidebar.module.scss';
import AddFAT from './dialogs/FAT/AddFAT';
import AddTAT from './dialogs/TAT/AddTAT';

const cx = classNames.bind(styles);
const Operate = () => {
  const { current, selectItems, delFAT, delTAT, delTAF } = useMappingRelationContext();
  const [addFATVisible, setAddFATVisible] = useState(false);
  const [addTAFVisible, setAddTAFVisible] = useState(false);
  const [addTATVisible, setAddTATVisible] = useState(false);

  return (
    <div className={cx('box-title')}>
      <b>
        {current === 7 && '散文件到档案类型的映射'}
        {current === 8 && '档案类型到散文件的映射'}
        {current === 9 && '档案类型与档案类型的映射'}
      </b>
      <Button
        className={cx('title-right')}
        onClick={
          current === 7
            ? () => setAddFATVisible(true)
            : current === 8
            ? () => setAddTAFVisible(true)
            : () => setAddTATVisible(true)
        }
      >
        新建映射
      </Button>
      <Button
        className={cx('title-right')}
        onClick={
          current === 7
            ? () => delFAT(selectItems)
            : current === 8
            ? () => delTAF(selectItems)
            : () => delTAT(selectItems)
        }
      >
        删除
      </Button>
      {useMemo(
        () => (
          <AddFAT
            visible={addFATVisible}
            onClose={() => {
              setAddFATVisible(false);
            }}
            type={1}
          />
        ),
        [addFATVisible]
      )}
      {useMemo(
        () => (
          <AddFAT
            visible={addTAFVisible}
            onClose={() => {
              setAddTAFVisible(false);
            }}
            type={2}
          />
        ),
        [addTAFVisible]
      )}
      {useMemo(
        () => (
          <AddTAT
            visible={addTATVisible}
            onClose={() => {
              setAddTATVisible(false);
            }}
          />
        ),
        [addTATVisible]
      )}
      {/* {useMemo(
        () => (
          <EditLibrary
            data={libraryList.find((item: any) => item.id === selectItems[0])}
            visible={editLibraryVisible}
            onClose={() => {
              setEditLibraryVisible(false);
            }}
          />
        ),
        [editLibraryVisible]
      )} */}
    </div>
  );
};
export default Operate;
